<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>CMS</title>
    <link href="__CSS__/common.css" rel="stylesheet"/>
    <link href="__CSS__/right.css" rel="stylesheet"/>
    <link rel="stylesheet" href="__INC__/form/css/zebra_form.css" type="text/css">
    <link rel="stylesheet" href="__CSS__/ui/jquery.ui.all.css">
    <script src="__JS__/jquery-1.7.2.min.js"></script>
    <script src="__JS__/ui/jquery.ui.core.js"></script>
    <script src="__JS__/ui/jquery.ui.widget.js"></script>
    <script src="__JS__/ui/jquery.ui.mouse.js"></script>
    <script src="__JS__/ui/jquery.ui.sortable.js"></script>
    <script src="__JS__/ui/jquery.ui.droppable.js"></script>
    <script src="__JS__/ui/jquery.ui.tabs.js"></script>
    <script src="__JS__/common.js"></script>
    <style>
        .cando .ui-state-default {
            margin: 0 5px 5px 5px;
            padding: 2px;
            width: 220px;
            float: left;
        }

        #sortable {
            list-style-type: none;
            margin: 0;
            padding: 0;
            width: 100%;
        }

        #sortable li {
            margin: 0 5px 5px 5px;
            padding: 5px;
            font-size: 1.2em;
            height: 1.5em;
        }

        .one {
            background: #fcfcfc;
        }

        #tabs .controls {
            float: right;
            margin-right: 5px;
        }

        #tabs .controls a {
            margin-right: 10px;
        }

        .nav_top_span {
            margin: 10px 15px;
        }
    </style>
    <script>
        $(function () {
            $(".cando").sortable().disableSelection();
            var $tabs = $("#tabs").tabs();
            var $tab_items = $("ul:first li", $tabs).droppable({
                accept: ".cando li",
                hoverClass: "ui-state-hover",
                drop: function (event, ui) {
                    var $item = $(this);
                    var $list = $($item.find("a").attr("href")).find(".cando");
                    /*ui.draggable.hide( "slow");
                     $( this ).appendTo( $list ); */
                    ui.draggable.hide("normal", function () {
                        //$tabs.tabs( "select", $tab_items.index( $item ) );
                        $(this).appendTo($list).show("slow");
                    });
                }
            });
            $("#sortable").sortable({
                placeholder: "ui-state-highlight"
            });
            $("#sortable").disableSelection();
        });
    </script>
</head>
<body>
<!--右侧区域 begin-->
<div class="right">
    <!--当前位置 begin-->
    <include file='common:crumbs'/>
    <!--当前位置 end-->
    <!--主体区域 begin-->
    <div class="container">
        <div class="alert_div">
            <h4 class="alert_info"><span class="welcome">{$welcome}</span>您现在的位置是：{$current} </h4>
            <h4 class="alert_what" style="display:none;"></h4>
        </div>
        <!--样式三 begin-->
        <div class="stats">
            <div class="lm_title">
                <div class="lm_title_l"><em>{$current}</em></div>
            </div>
            <div class="lm_content">
                <div class="demo" style="min-height:400px;height:100%;_height:400px;">
                    <div id="tabs" style="border:none;">
                        <ul>
                            {$topnav}
                        </ul>
                        {$module}
                    </div>
                </div>
                <table class="Zebra_Form" style="width:100%;text-align: center;">
                    <tr>
                        <td>
                            <input type="button" value="功能模块添加" onclick="var _id = $('.ui-state-active a').attr('_id');javascript:location.href='__GROUP__/nav/moduleadd?nid='+_id; " class="button"/>&nbsp;&nbsp;&nbsp;
                            <input type="button" value="保存顺序" onclick="savemodole()" class="button"/>&nbsp;&nbsp;&nbsp;
                            <input type="button" value="管理导航栏目" onclick="javascript:location.href='__URL__/navmanage'" class="button"/>
                        </td>
                    </tr>
                </table>
            </div>
            <div class="lm_bottom">
                <div class="lm_bottom_l"><em></em></div>
            </div>
        </div>
        <!--样式三 end-->
    </div>
    <!--主体区域 end-->
</div>
<!--右侧区域  end-->
<!--弹出层二begin-->
<div class="popupPanel">
    <div class="stats">
        <div class="lm_title">
            <div class="lm_title_l"><em id="panelTitle">做什么？</em></div>
        </div>
        <div class="lm_content">
            <table class="Zebra_Form" style="width:100%;">
                <tr class="row">
                    <td width="60"><label>已选ID：</label></td>
                    <input type="hidden" id="controlitems" value=""/>
                    <input type="hidden" id="panelaction" value=""/>
                    <td colspan="2" id="checked_items"><label style="color:#FF00AE;"></label></td>
                </tr>
                <tr class="row">
                    <td></td>
                    <td><input type="button" onclick="panelDo()" class="button" value="确定"/></td>
                    <td><input type="button" class="button" onclick="panelClose()" value="取消"/></td>
                </tr>
            </table>
        </div>
        <div class="lm_bottom">
            <div class="lm_bottom_l"><em></em></div>
        </div>
    </div>
</div>
<!--弹出层二end-->
</body>
<script>
    function savemodole() {
        json = '';
        var top = $(".navtop");
        top.each(function (index) {
            var index = index + 1;
            var fid = $(this).attr("_id");
            var temp = $("#tabs-" + index + " li");
            temp.each(function (index) {
                var id = $(this).attr('_id');
                /* 		var tarr = new Array();
                 tarr['id'] = id;
                 tarr['order'] = index;
                 tarr['fid'] = fid;
                 //tarr['name'] = $(this).text();
                 window.arr.push(tarr); */
                var temp = '';
                temp = "{'id':'" + id + "','fid':'" + fid + "','order':'" + index + "'},";
                json += temp;
            });
        });
        json = "[" + json + "]";
        json = eval(json);
        //alert(xxx);
        $.post("{:U('ajax/navajax')}", {'action': 'moduleorder', 'data': json}, function (data) {
            if (data != 1) {
                jl_notify(2, "顺序保存失败！");
            } else {
                jl_notify(1, "顺序保存成功！");
            }
            return;
        });
    }

    //开启panel窗口
    function openpanel(act, item) {
        //初始化关闭所有附加panel
        if (item === undefined || typeof(item) == 'undefined') {
            item = getSelects();
        }
        if (item == '') {
            jl_notify(3, "你没有选中任何项！");
            return;
        }
        $("#controlitems").val(item);
        $('#checked_items label').text(item);
        if (act == 'moduledel') {
            $("#panelTitle").text("你确定要删除该功能模块？");
            $("#panelaction").val("moduledel");
            var obj = $('.popupPanel');
            jl_fadeIn(obj);
        } else {
            jl_notify(3, "不知道你到底要干什么！");
            return;
        }
    }

    //关闭panel窗口
    function panelClose() {
        var obj = $('.popupPanel');
        jl_fadeOut(obj);
    }

    //panel执行操作
    function panelDo() {
        var act = $("#panelaction").val();
        if (act == '') {
            jl_notify(3, "不知道你到底要干什么！");
            return;
        }
        if (act == 'moduledel') {
            jl_fadeOut($('.popupPanel'));
            var items = $("#controlitems").val();
            location.href = "__GROUP__/nav/moduledel?id=" + items;
        } else {
            jl_notify(3, "不知道你到底要干什么！");
            return;
        }
    }
</script>
</html>